<template>
  <div style="border: 1px solid black; padding: 10px;">
    爷爷：（家庭总资产为：{{ assets.toFixed(2) }}元）
    <button @click="makeMoney(100)">赚钱</button>
    <button @click="spendMoney(50)">花钱</button>
    <Father />
  </div>
</template>

<script setup lang="ts">
import { ref, provide } from 'vue';
import Father from './Father.vue';

const assets = ref<number>(0.00);

provide('assets', assets);
provide('makeMoney', (money: number) => {
  assets.value += money;
});
provide('spendMoney', (money: number) => {
  assets.value = Math.max(assets.value - money, 0);
});

function makeMoney(money: number): void {
  assets.value += money;
}

function spendMoney(money: number): void {
  assets.value = Math.max(assets.value - money, 0);
}
</script>
